/**
 * @description List1列表对应的装修1属性
 */
import React from 'react';
import { Collapse, Form, InputNumber, Radio } from 'antd';

import { FlagOptions } from '@/utils/Const';
import { getPropData } from './utils';

import StyleWrapper from '@/components/StylesWrapper';


// TODO: 把exhibition生成参数，这样可以服用
function GoodAttr2({ blockKey, form, upateStyleEvent, onConfigEvent }) {


  // 属性的输入框变化时，触发 upateStyleEvent --> 更新style样式
  let handleStyleEvent = (paramKey) => {
    upateStyleEvent([blockKey, `${blockKey}_${paramKey}`])
  }

  return (
    <>
      <Form.Item
        label="个数"
        name={[blockKey, 'base', 'limit']}
      >
        <InputNumber
          min={1}
          precision={0}
          onChange={(value) => onConfigEvent([blockKey, 'base', 'limit'], value)}
        />
      </Form.Item>

      <Form.Item
        label="图标开关"
        name={[blockKey, 'base', 'iconFlag']}
      >
        <Radio.Group
          options={FlagOptions}
          onChange={(e) => onConfigEvent([blockKey, 'base', 'iconFlag'], e.target.value)}
          optionType="button"
          buttonStyle="solid"
        />
      </Form.Item>

      <Form.Item
        label="标签开关"
        name={[blockKey, 'base', 'labelFlag']}
      >
        <Radio.Group
          options={FlagOptions}
          onChange={(e) => onConfigEvent([blockKey, 'base', 'labelFlag'], e.target.value)}
          optionType="button"
          buttonStyle="solid"
        />
      </Form.Item>

      <Collapse accordion items={[
        {
          key: "box",
          label: "总盒子",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_box', 'default')} onStyleChange={() => handleStyleEvent('list_box')} />
        },
        {
          key: "item",
          label: "item盒子",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_item', 'default')} onStyleChange={() => handleStyleEvent('list_item')} />
        },
        {
          key: "item-hover",
          label: "item盒子-悬浮",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_item', 'hover')} onStyleChange={() => handleStyleEvent('list_item')} />
        },
        {
          key: "img",
          label: "图片",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_img', 'default')} onStyleChange={() => handleStyleEvent('list_img')} />
        },
        {
          key: "info",
          label: "信息盒子",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_info', 'default')} onStyleChange={() => handleStyleEvent('list_info')} />
        },
        {
          key: "info-显示",
          label: "信息盒子-显示",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_info_hover', 'default')} onStyleChange={() => handleStyleEvent('list_info_hover')} />
        },
        {
          key: "name",
          label: "标题",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_name', 'default')} onStyleChange={() => handleStyleEvent('list_name')} />
        },
        {
          key: "price",
          label: "价格",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_price', 'default')} onStyleChange={() => handleStyleEvent('list_price')} />
        },
        {
          key: "publisher",
          label: "发布人",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_publisher', 'default')} onStyleChange={() => handleStyleEvent('list_publisher')} />
        },
        {
          key: "time",
          label: "时间",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_time', 'default')} onStyleChange={() => handleStyleEvent('list_time')} />
        },
        {
          key: "like",
          label: "点赞",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_like', 'default')} onStyleChange={() => handleStyleEvent('list_like')} />
        },
        {
          key: "collect",
          label: "收藏",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_collect', 'default')} onStyleChange={() => handleStyleEvent('list_collect')} />
        },
        {
          key: "view",
          label: "点击",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_view', 'default')} onStyleChange={() => handleStyleEvent('list_view')} />
        },
        {
          key: "desc",
          label: "简介",
          children: <StyleWrapper form={form}  {...getPropData(blockKey, 'list_desc', 'default')} onStyleChange={() => handleStyleEvent('list_desc')} />
        },
      ]}
      />
    </>
  )
}



export default React.memo(GoodAttr2)